<template>
    <lay-layer v-model="visible" :title="layer_title" :area="['860px', '500px']" :shadeClose="shadeClose" :maxmin="true"
        :moveOut="true" :resize="true" closeBtn="1" :end="end" :close="close" :beforeClose="beforeClose" :btn="FORM_btn">
        <lay-form :model="modelForm" ref="Form_Ref" required :pane="true" size="sm">
            <lay-tab type="card" v-model="Tab_vmodel" @change="tab_change_unit" style="padding:0px;margin: 0px;">
                <lay-tab-item title="基础信息" id="1">
                    <div style="padding-left: 10px;padding-right: 10px;">
                        <lay-row>
                            <lay-col md="9">
                                <div>
                                    <lay-form-item label="商品条码" prop="barcode">
                                        <template #label>
                                            <lay-tooltip position="right" :enterable="false" content="尽量不要重复，扫码打印优先使用。">
                                                <span>商品条码</span>
                                            </lay-tooltip>
                                        </template>
                                        <lay-input v-model.string="modelForm.barcode" type="string"
                                            :disabled="modelForm.off_operation == 1"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="商品名称" prop="name">
                                        <lay-input v-model.string="modelForm.name" type="string"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="基本单位" prop="unit">
                                        <template #label>
                                            <lay-tooltip position="right" :enterable="false"
                                                content="基本单位(最小出入库单位)例子：20支烟=1包烟/10包烟=1条烟/20条烟=1箱烟，如此类推。如果1支烟也销售那么基本单位做“支”。如果你是批发商最小销售单位为“条”那就做条。禁止做基本单位为条，而后续销售时0.1条出库。">
                                                <span>基本单位</span>
                                            </lay-tooltip>
                                        </template>
                                        <lay-input v-model.string="modelForm.unit" type="string"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="自动编号">
                                        <template #label>
                                            <lay-tooltip position="right" :enterable="false" content="尽量由系统自动生成。">
                                                <span>自动编号</span>
                                            </lay-tooltip>
                                        </template>
                                        <lay-input v-model="modelForm.auto_number" :disabled="modelForm.off_operation == 1">
                                            <template #suffix>
                                                <lay-icon type="layui-icon-refresh-three"
                                                    @click="auto_number_GoodsAutoNumber"></lay-icon>
                                            </template>
                                        </lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="商品货号">
                                        <lay-input v-model="modelForm.goods_no"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="序列号">
                                        <lay-input v-model="modelForm.serial_number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="自编码">
                                        <lay-input v-model="modelForm.custom_code"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="商城品名">
                                        <lay-input v-model="modelForm.name_web" placeholder="商城显示的名称"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="打印品名">
                                        <lay-input v-model="modelForm.name_print" placeholder="商城显示的名称"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="拼音码">
                                        <lay-input v-model="modelForm.name_py"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="商品品牌">
                                        <lay-input v-model="modelForm.brand"></lay-input>
                                    </lay-form-item>
                                </div>
                            </lay-col>
                            <lay-col md="6">
                                <div style="padding-left: 10px;padding-right: 10px;">
                                    <lay-form-item label="进货价/元">
                                        <lay-input v-model.number="modelForm.prc_in" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="批发价/元">
                                        <lay-input v-model.number="modelForm.prc_cust" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="会员价/元">
                                        <lay-input v-model.number="modelForm.prc_vip" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="零售价/元">
                                        <lay-input v-model.number="modelForm.prc_sale" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="商城价/元">
                                        <lay-input v-model.number="modelForm.prc_web" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="配送价/元">
                                        <lay-input v-model.number="modelForm.prc_dist" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="调货价/元">
                                        <lay-input v-model.number="modelForm.prc_transfer_goods" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="同行价/元">
                                        <lay-input v-model.number="modelForm.prc_same" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="团购价/元">
                                        <lay-input v-model.number="modelForm.prc_groupon" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="微商价/元">
                                        <lay-input v-model.number="modelForm.prc_ws" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="团长价/元">
                                        <lay-input v-model.number="modelForm.prc_head" type="number"></lay-input>
                                    </lay-form-item>
                                </div>
                            </lay-col>
                            <lay-col md="9">
                                <div>
                                    <lay-form-item label="商品类别">
                                        <lay-tree-select v-model.number="modelForm.cls_id" :data="godds_cls_data"
                                            @change="change_godds_cls_data"></lay-tree-select>
                                    </lay-form-item>
                                    <lay-form-item label="主供应商">
                                        <lay-tree-select v-model="modelForm.sup_dbid" :data="sup_data"
                                            @change="change_sup_data"></lay-tree-select>
                                    </lay-form-item>
                                    <lay-form-item label="商品性质">
                                        <lay-select v-model="modelForm.nature_flag" placeholder="请选择">
                                            <lay-select-option value="A" label="普通"></lay-select-option>
                                            <lay-select-option value="B" label="称重"></lay-select-option>
                                            <lay-select-option value="C" label="按份"></lay-select-option>
                                            <lay-select-option value="D" label="按次"></lay-select-option>
                                            <lay-select-option value="E" label="按时"></lay-select-option>
                                            <lay-select-option value="F" label="面价"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="捆绑组合">
                                        <lay-select v-model="modelForm.group_flag" placeholder="请选择">
                                            <lay-select-option value="A" label="普通"></lay-select-option>
                                            <lay-select-option value="B" label="组合"></lay-select-option>
                                            <lay-select-option value="C" label="拆分"></lay-select-option>
                                            <lay-select-option value="D" label="自动组合"></lay-select-option>
                                            <lay-select-option value="E" label="自动拆分"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="商品状态">
                                        <lay-select v-model="modelForm.state" placeholder="请选择">
                                            <lay-select-option value="A" label="正常"></lay-select-option>
                                            <lay-select-option value="B" label="停用"></lay-select-option>
                                            <lay-select-option value="C" label="只销"></lay-select-option>
                                            <lay-select-option value="D" label="只购"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="提成方式">
                                        <lay-select v-model="modelForm.deduct" placeholder="请选择">
                                            <lay-select-option value="A" label="按金额"></lay-select-option>
                                            <lay-select-option value="B" label="提成率"></lay-select-option>
                                            <lay-select-option value="C" label="按计划"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="经销方式">
                                        <lay-select v-model="modelForm.distribute" placeholder="请选择">
                                            <lay-select-option value="A" label="购销"></lay-select-option>
                                            <lay-select-option value="B" label="代销"></lay-select-option>
                                            <lay-select-option value="C" label="联营"></lay-select-option>
                                            <lay-select-option value="C" label="自产自销"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="封装方式">
                                        <lay-select v-model="modelForm.encapsulation" placeholder="请选择">
                                            <lay-select-option value="A" label="未知"></lay-select-option>
                                            <lay-select-option value="A2" label="其它"></lay-select-option>
                                            <lay-select-option value="B1" label="袋装"></lay-select-option>
                                            <lay-select-option value="B2" label="瓶装"></lay-select-option>
                                            <lay-select-option value="B3" label="罐装"></lay-select-option>
                                            <lay-select-option value="B4" label="盒装"></lay-select-option>
                                            <lay-select-option value="B5" label="箱装"></lay-select-option>
                                            <lay-select-option value="C1" label="裸装"></lay-select-option>
                                            <lay-select-option value="C2" label="散装"></lay-select-option>
                                            <lay-select-option value="C3" label="无包装"></lay-select-option>
                                            <lay-select-option value="C4" label="临封装"></lay-select-option>
                                            <lay-select-option value="D1" label="真空袋"></lay-select-option>
                                            <lay-select-option value="D2" label="真空罐"></lay-select-option>
                                            <lay-select-option value="D3" label="真空装"></lay-select-option>
                                            <lay-select-option value="E1" label="桶装"></lay-select-option>
                                            <lay-select-option value="E2" label="筒装"></lay-select-option>
                                            <lay-select-option value="E3" label="篮箩筐装"></lay-select-option>
                                            <lay-select-option value="E4" label="盘装"></lay-select-option>
                                            <lay-select-option value="E5" label="网装"></lay-select-option>
                                            <lay-select-option value="E6" label="捆扎装"></lay-select-option>
                                            <lay-select-option value="E7" label="穿钩装"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="形态">
                                        <lay-select v-model="modelForm.form" placeholder="请选择">
                                            <lay-select-option value="A" label="未知"></lay-select-option>
                                            <lay-select-option value="B" label="固体"></lay-select-option>
                                            <lay-select-option value="C" label="液体"></lay-select-option>
                                            <lay-select-option value="D" label="粉状"></lay-select-option>
                                            <lay-select-option value="E" label="软体"></lay-select-option>
                                            <lay-select-option value="F" label="其它"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="毒性">
                                        <lay-select v-model="modelForm.toxicity" placeholder="请选择">
                                            <lay-select-option value="A" label="未知"></lay-select-option>
                                            <lay-select-option value="B" label="无毒"></lay-select-option>
                                            <lay-select-option value="C" label="剧毒"></lay-select-option>
                                            <lay-select-option value="D" label="高毒"></lay-select-option>
                                            <lay-select-option value="E" label="中毒"></lay-select-option>
                                            <lay-select-option value="F" label="低毒"></lay-select-option>
                                            <lay-select-option value="G" label="微毒"></lay-select-option>
                                        </lay-select>
                                    </lay-form-item>
                                    <lay-form-item label="保质期" prop="expiration">
                                        <lay-input v-model.number="modelForm.expiration" type="number"
                                            style="width: 100px;">
                                            <template #suffix>天</template>
                                        </lay-input>
                                        <lay-switch size="md" v-model="modelForm.off_expiration" onswitch-text="保质期管理开"
                                            unswitch-text="保质期管理关" :onswitch-value=1 :unswitch-value=0></lay-switch>
                                    </lay-form-item>
                                </div>
                            </lay-col>
                        </lay-row>
                        <lay-row>
                            <lay-col md="8">
                                <div>
                                    <lay-form-item label="包装规格">
                                        <lay-input v-model="modelForm.unit_size"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="商品规格">
                                        <lay-input v-model="modelForm.goods_size"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="规格款式">
                                        <lay-input v-model="modelForm.sku_size"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="产地">
                                        <lay-input v-model="modelForm.producing_area"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="厂家">
                                        <lay-input v-model="modelForm.manufacturers"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="型号">
                                        <lay-input v-model="modelForm.product_model"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="口味">
                                        <lay-input v-model="modelForm.taste"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="版本">
                                        <lay-input v-model="modelForm.edition"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="商标">
                                        <lay-input v-model="modelForm.trademark"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="颜色">
                                        <lay-input v-model="modelForm.colour"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="尺寸">
                                        <lay-input v-model="modelForm.size"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="属性">
                                        <lay-input v-model="modelForm.attribute"></lay-input>
                                    </lay-form-item>
                                </div>
                            </lay-col>
                            <lay-col md="8">
                                <div style="padding-left: 10px;padding-right: 10px;">
                                    <lay-form-item label="毛重">
                                        <lay-input v-model="modelForm.gw">
                                            <template #suffix>克</template>
                                        </lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="净重">
                                        <lay-input v-model="modelForm.nw">
                                            <template #suffix>克</template>
                                        </lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="浓度">
                                        <lay-input v-model="modelForm.concentration">
                                        </lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="体积">
                                        <lay-input v-model="modelForm.volume"></lay-input>
                                        <template #suffix>平方</template>
                                    </lay-form-item>
                                    <lay-form-item label="毛利率">
                                        <lay-input v-model.number="modelForm.gross_margin" type="number">
                                            <template #suffix>/%</template>
                                        </lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="积分率/元">
                                        <lay-input v-model.number="modelForm.integration" type="number">
                                            <template #suffix>/分</template>
                                        </lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="过敏源">
                                        <lay-input v-model="modelForm.allergen"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="禁忌">
                                        <lay-input v-model="modelForm.taboos"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="库存上限">
                                        <lay-input v-model.number="modelForm.stock_ceiling" type="number"></lay-input>
                                    </lay-form-item>
                                    <lay-form-item label="库存下限">
                                        <lay-input v-model.number="modelForm.stock_lower" type="number"></lay-input>
                                    </lay-form-item>
                                </div>
                            </lay-col>
                            <lay-col md="8">
                                <lay-field title="开关" style="width:270px;">
                                    <template #title>
                                        <span style="font-size: 14px;">开关</span>
                                    </template>
                                    <lay-form-item>
                                        <lay-checkbox name="off_stock" v-model="off_array.off_stock" value="off_stock"
                                            label="管理库存"
                                            @click="off_array_click($event, 'off_stock', off_array.off_stock)"></lay-checkbox>
                                        <lay-checkbox name="off_discount" v-model="off_array.off_discount"
                                            value="off_discount" label="可以打折"
                                            @click="off_array_click($event, 'off_discount', off_array.off_discount)"></lay-checkbox>
                                    </lay-form-item>
                                    <lay-form-item>
                                        <lay-checkbox name="off_deduct" v-model="off_array.off_deduct" value="off_deduct"
                                            label="开启提成"
                                            @click="off_array_click($event, 'off_deduct', off_array.off_deduct)"></lay-checkbox>
                                        <lay-checkbox name="off_after_sale" v-model="off_array.off_after_sale"
                                            value="off_after_sale" label="拥有售后"
                                            @click="off_array_click($event, 'off_after_sale', off_array.off_after_sale)"></lay-checkbox>
                                    </lay-form-item>
                                    <lay-form-item>
                                        <lay-checkbox name="off_putaway_web" v-model="off_array.off_putaway_web"
                                            value="off_putaway_web" label="上架商城"
                                            @click="off_array_click($event, 'off_putaway_web', off_array.off_putaway_web)"></lay-checkbox>
                                        <lay-checkbox name="off_print_label" v-model="off_array.off_print_label"
                                            value="off_print_label" label="打印标签"
                                            @click="off_array_click($event, 'off_print_label', off_array.off_print_label)"></lay-checkbox>
                                    </lay-form-item>
                                    <lay-form-item>
                                        <lay-checkbox name="off_market_goods" v-model="off_array.off_market_goods"
                                            value="off_market_goods" label="专柜商品"
                                            @click="off_array_click($event, 'off_market_goods', off_array.off_market_goods)"></lay-checkbox>
                                        <lay-checkbox name="off_freebie" v-model="off_array.off_freebie" value="off_freebie"
                                            label="可为赠品"
                                            @click="off_array_click($event, 'off_freebie', off_array.off_freebie)"></lay-checkbox>
                                    </lay-form-item>
                                </lay-field>
                            </lay-col>
                        </lay-row>
                    </div>
                </lay-tab-item>
                <lay-tab-item title="多包装/多条码" id="A2">
                    <div style="padding:0px 10px 0px 10px;margin: 0px;">
                        <lay-form-item>
                            <lay-row space="10">
                                <lay-col md="16">
                                    <!-- 多单位-表格 -->
                                    <lay-table height="190px" size="sm" :columns="GP.Goods_unit_columns"
                                        :data-source="modelForm.unit_tab" :rowStyle="cellStyle" @row="Goods_unit_row">
                                        <template #unit_pack="{ data }">
                                            <span :style="data.unit_pack == 'A' ? '' : 'color: #FF6C37;'">
                                                {{ data.unit_pack == "A" ? "是" : "否" }}
                                            </span>
                                        </template>
                                        <template #barcode="{ data }">
                                            <lay-input v-if="data.isEdit" :model-value="data.barcode"
                                                :disabled="data.off_operation == 1"
                                                @input="GoodsPackChangeData($event, data, 'barcode')"></lay-input>
                                            <span v-else>
                                                {{ data.barcode }}
                                            </span>
                                        </template>
                                        <template #unit="{ data }">
                                            <lay-input v-if="data.isEdit" :model-value="data.unit"
                                                @input="GoodsPackChangeData($event, data, 'unit')"></lay-input>
                                            <span v-else>
                                                {{ data.unit }}
                                            </span>
                                        </template>
                                        <template #unit_factor="{ data }">
                                            <lay-input v-if="data.isEdit" :model-value="data.unit_factor"
                                                @input="GoodsPackChangeData($event, data, 'unit_factor')"></lay-input>
                                            <span v-else>
                                                <lay-tooltip :enterable="false" :content="tooltip_content(data)">
                                                    <span>{{ data.unit_factor }}</span>
                                                </lay-tooltip>
                                            </span>
                                        </template>
                                        <template #unit_size="{ data }">
                                            <lay-input v-if="data.isEdit" :model-value="data.unit_size"
                                                @input="GoodsPackChangeData($event, data, 'unit_size')"></lay-input>
                                            <span v-else>
                                                {{ data.unit_size }}
                                            </span>
                                        </template>
                                        <template #operate="{ data }">
                                            <span v-if="data.unit_pack == 'A'">
                                                <lay-button type="primary" size="xs" v-if="!data.isEdit"
                                                    @click="GoodsPackEdit(data)">
                                                    编辑
                                                </lay-button>
                                                <lay-button type="primary" size="xs" v-if="data.isEdit"
                                                    @click="GoodsPackSaveTable(data)">
                                                    保存
                                                </lay-button>
                                                <lay-button type="danger" size="xs" v-if="data.dbid == ''"
                                                    @click="GoodsPackDel(data)">
                                                    删除
                                                </lay-button>
                                            </span>
                                            <span v-else>
                                                <lay-tooltip content="基本单位商品">
                                                    <span>基本单位</span>
                                                </lay-tooltip>
                                            </span>
                                        </template>
                                    </lay-table>
                                    <lay-button border="green" border-style="dashed" :fluid="true" @click="GoodsPackAdd"
                                        style="margin-top: 10px">新增</lay-button>
                                </lay-col>
                                <lay-col md="8">
                                    <!-- 辅助条码-表格 -->
                                    <lay-table resize height="190px" size="sm" :columns="GP.Goods_barcode_columns"
                                        :data-source="current_data.barcode_data">
                                        <template #barcode="{ data }">
                                            <lay-input v-if="data.isEdit && data.db_state == 'A'"
                                                :model-value="data.barcode"
                                                @input="GoodsBarcodeChangeData($event, data, 'barcode')"></lay-input>
                                            <span v-else>
                                                {{ data.barcode }}
                                            </span>
                                        </template>
                                        <template #operate="{ data }">
                                            <div v-if="data.db_state == 'A'">
                                                <lay-button type="primary" size="xs" v-if="!data.isEdit"
                                                    @click="GoodsBarcodeEdit(data)">
                                                    编辑
                                                </lay-button>
                                                <lay-button type="primary" size="xs" v-if="data.isEdit"
                                                    @click="GoodsBarcodeSaveTable(data)">
                                                    保存
                                                </lay-button>
                                                <lay-button type="danger" size="xs" @click="GoodsBarcodeDel(data)">
                                                    删除
                                                </lay-button>
                                            </div>
                                        </template>
                                    </lay-table>
                                    <lay-button border="green" border-style="dashed" :fluid="true" @click="GoodsBarcodeAdd"
                                        style="margin-top: 10px" v-if="current_data.current">新增</lay-button>
                                </lay-col>
                            </lay-row>
                        </lay-form-item>
                        <lay-form-item>
                            <lay-field title="价格模块" style="width:100%;" v-if="current_data.goods_info.unit_pack == 'A'">
                                <template #title>
                                    <span style="font-size: 14px;">大包装-{{ current_data.goods_info.id }}：{{
                                        current_data.goods_dbid
                                    }}</span>
                                </template>
                                <lay-row space="8">
                                    <lay-col md="12">
                                        <div>
                                            <lay-form-item label="商品名称">
                                                <lay-input v-model="current_data.goods_info.name"></lay-input>
                                            </lay-form-item>
                                        </div>
                                    </lay-col>
                                    <lay-col md="12">
                                        <lay-form-item>
                                            <lay-checkbox name="unit_off_putaway_web"
                                                v-model="current_data.goods_info.off_array.off_putaway_web"
                                                value="unit_off_putaway_web" label="上架商城"
                                                @click="unit_off_array_click($event, 'off_putaway_web', current_data.goods_info.off_array.off_putaway_web)"></lay-checkbox>
                                        </lay-form-item>
                                    </lay-col>
                                </lay-row>
                                <lay-row space="8">
                                    <lay-col md="6">
                                        <div>
                                            <lay-form-item label="进货价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_in"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                            <lay-form-item label="商城价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_web"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                        </div>
                                    </lay-col>
                                    <lay-col md="6">
                                        <div>
                                            <lay-form-item label="批发价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_cust"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                            <lay-form-item label="团购价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_groupon"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                        </div>
                                    </lay-col>
                                    <lay-col md="6">
                                        <div>
                                            <lay-form-item label="会员价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_vip"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                            <lay-form-item label="配送价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_dist"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                        </div>
                                    </lay-col>
                                    <lay-col md="6">
                                        <div>
                                            <lay-form-item label="零售价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_sale"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                            <lay-form-item label="同行价/元">
                                                <lay-input v-model.number="current_data.goods_info.prc_same"
                                                    type="number"></lay-input>
                                            </lay-form-item>
                                        </div>
                                    </lay-col>
                                </lay-row>
                            </lay-field>
                        </lay-form-item>
                    </div>

                </lay-tab-item>
                <!-- 辅助条码 END -->
            </lay-tab>
        </lay-form>
    </lay-layer>
</template>

<script setup lang="ts">
import { ref, reactive } from 'vue';
import { layer } from '@layui/layui-vue';
import { GoodsUP, GoodsNEW, GoodsID, BarcodeNew, GoodsAutoNumber } from "../../../../api/module/user"; //请求模块
import GoodsPack from "./GoodsPack";//商品多包装单位、多条码设置文件
const GP = new GoodsPack;
const BBS = GP.AA('GoodsPack 加载......' + window.location.href);
const emit = defineEmits(['topClick']);//子父组件通讯
const layer_title = ref('新增');//弹窗标题
const shadeClose = ref(true);//遮盖层关闭
const http_r_p = ref('up');//新增还是修改
const visible = ref<boolean>(false);// 弹窗显示
const Tab_vmodel = ref("1");//选项卡Tab当前激活ID 
const Form_Ref = ref();//表单监听Ref
// 初始化-表单字段
const modelForm = ref<any>({
    "id": -1,
    "dbid": "",
    "barcode": "商品条码",//商品条码
    "name": "商品名称",//商品名称
    "unit": "基本单位",//基本单位
    "auto_number": "自动编号",//自动编号
    "goods_no": "商品货号",//商品货号
    "serial_number": "序列号",//序列号
    "custom_code": "自编码",//自编码
    "name_web": "商城品名",//商城品名
    "name_print": "打印品名",//打印品名
    "name_py": "拼音码",//拼音码
    "brand": "商品品牌",//商品品牌
    "prc_in": 0.00,//进货价
    "prc_cust": 0.00,//批发价
    "prc_vip": 0.00,//会员价
    "prc_sale": 0.00,//零售价
    "prc_web": 0.00,//商城价
    "prc_dist": 0.00,//配送价
    "prc_transfer_goods": 0.00,//调货价
    "prc_same": 0.00,//同行价
    "prc_groupon": 0.00,//团购价
    "prc_ws": 0.00,//微商价
    "prc_head": 0.00,//团长价
    "cls_id": 1,//商品类别
    "sup_dbid": "SUP-SYS",//主供应商
    "nature_flag": "A",//商品性质
    "group_flag": "A",//捆绑组合
    "state": "A",//商品状态
    "deduct": "A",//提成方式
    "distribute": "A",//经销方式
    "encapsulation": "A",//封装方式
    "form": "A",//形态
    "toxicity": "A",//毒性
    "unit_size": "包装规格",//包装规格
    "goods_size": "商品规格",//商品规格
    "sku_size": "规格款式",//规格款式
    "producing_area": "产地",//产地
    "manufacturers": "厂家",//厂家
    "product_model": "型号",//型号
    "taste": "",//口味
    "edition": "版本",//版本
    "trademark": "商标",//商标
    "colour": "颜色",//颜色
    "size": "尺寸",//尺寸
    "attribute": "属性",//属性
    "gw": "毛重",//毛重
    "nw": "净重",//净重
    "concentration": "浓度",//浓度
    "volume": "体积",//体积
    "allergen": "过敏源",//过敏源
    "taboos": "禁忌",//禁忌
    "stock_ceiling": 0,//库存上限
    "stock_lower": 0,//库存下限
    "gross_margin": 1,//毛利率
    "integration": 1,//积分率
    "expiration": 0,//保质期
    "off_expiration": 0, //开关-管保质期_1是0否
    "off_stock": 0, //开关-管理库存_1是0否
    "off_deduct": 0, //开关-开启提成_1是0否
    "off_discount": 0, //开关-可以打折_1是0否
    "off_after_sale": 0, //开关-拥有售后_1是0否
    "off_putaway_web": 0, //开关-上架商城_1是0否
    "off_print_label": 0, //开关-打印标签_1是0否
    "off_market_goods": 0, //开关-专柜商品_1是0否
    "off_freebie": 0, //开关-可为赠品_1是0否
    'off_operation': 0, //-开关-产生业务_1是0否
    'off_lock_up': 0, //-编辑锁定_1是0否
    "off_array": {
        'off_expiration': true,//开关-管保质期_1是0否
        'off_stock': true,//开关-管理库存_1是0否
        'off_deduct': true,//开关-开启提成_1是0否
        'off_discount': true,//开关-可以打折_1是0否
        'off_after_sale': true,//开关-拥有售后_1是0否
        'off_putaway_web': true,//开关-上架商城_1是0否
        'off_print_label': true,//开关-打印标签_1是0否
        'off_market_goods': true,//开关-专柜商品_1是0否
        'off_freebie': true//开关-可为赠品_1是0否
    },
    "unit_tab": [{
        "id": -1,
        "dbid": "",//
        "barcode": "",//
        "barcode_data": [{
            "id": -1,
            "barcode": "辅助条码",//
            "goods_dbid": "归属商品",//归属商品
            "db_state": "A",//
        }]
    }]
});

// 基本单位-开关类集合
const off_array = ref({
    'off_expiration': true,//开关-管保质期_1是0否
    'off_stock': true,//开关-管理库存_1是0否
    'off_deduct': true,//开关-开启提成_1是0否
    'off_discount': true,//开关-可以打折_1是0否
    'off_after_sale': true,//开关-拥有售后_1是0否
    'off_putaway_web': true,//开关-上架商城_1是0否
    'off_print_label': true,//开关-打印标签_1是0否
    'off_market_goods': true,//开关-专柜商品_1是0否
    'off_freebie': true//开关-可为赠品_1是0否
});
// 基本单位-开关类状态转换
function off_array_click(event: any, off_key: any, off_value: boolean) {
    // console.log("基本单位-开关开关类集合回调", event.target.innerText, off_key, off_value);
    if (off_value) {
        modelForm.value[off_key] = 1;
    } else {
        modelForm.value[off_key] = 0;
    }
};
// 大单位-开关类状态转换
function unit_off_array_click(event: any, off_key: any, off_value: boolean) {
    console.log("大单位-开关开关类集合回调", event.target.innerText, off_key, off_value);
    modelForm.value.unit_tab.forEach((item: any, index: number, array: any) => {
        if (item.dbid === current_data.value.goods_dbid) {
            if (off_value) {
                modelForm.value.unit_tab[index][off_key] = 1;
            } else {
                modelForm.value.unit_tab[index][off_key] = 0;
            }
        }
    })
};
// 当前激活的焦点数据
const current_data = ref(
    {
        "current": false,//当前是否激活
        "goods_dbid": "",//商品档案表的数据编号-后端使用
        "barcode_data": [],//辅助条码-后端使用
        "goods_info": {
            "id": -1,//
            "unit_pack": "A",//是否大单位_A是B否
            "name": "商品名称",//商品名称
            "prc_in": 0.00,//进货价
            "prc_web": 0.00,//商城价
            "prc_cust": 0.00,//批发价
            "prc_groupon": 0.00,//团购价
            "prc_vip": 0.00,//会员价
            "prc_dist": 0.00,//配送价
            "prc_sale": 0.00,//零售价
            "prc_same": 0.00,//同行价
            "off_array": {
                "off_putaway_web": true,//开关-上架商城_1是0否
            }
        },//商品档案信息
    }
);
//表单提交按键组
const FORM_btn = ref([
    {
        text: "表单提交",
        callback: () => {
            submit();//提交
        }
    },
    {
        text: "表单较验",
        callback: () => {
            Form_validate();//表单较验
        }
    },
    {
        text: "清除较验",
        callback: () => {
            clearValidate();//清除较验
        }
    },
    {
        text: "取消",
        callback: () => {
            // original();//原始数据
            visible.value = !visible.value;//弹窗显示
        }
    }
]);




const form = reactive({});//缓存旧数据为还原表单做准备
// 商品分类树
const godds_cls_data = ref([{
    title: '顶级类别',
    id: 1,//类别ID
    pid: 0,//父ID
    children: []
}]);
// 供应商列表
const sup_data = ref([{
    title: '主供应商',
    id: "SUP-SYS",//供应商sup_dbid
}]);
// 商品类别选择器点击事件
function change_godds_cls_data(data: any) {
    console.log("商品类别选择器点击事件:", data);
};
// 供应商选择器点击事件
function change_sup_data(data: any) {
    console.log("供应商选择器点击事件", data);
};
// 单条商品远程数据
async function goods_id(id: number, dbid: string) {
    // modelForm.value = {};
    current_data.value.current = false;
    let http_db = await GoodsID({ id, dbid });//远程获取树数据
    modelForm.value = http_db.db;//把上级行数据填到窗口中
    modelForm.value.unit_tab.forEach((item: any, index: number, array: any) => {
        if (item.dbid === current_data.value.goods_dbid) {
            current_data.value.barcode_data = modelForm.value.unit_tab[index].barcode_data;
            current_data.value.current = true;
        }
    })
    off_array.value = modelForm.value.off_array;//开关类集合

    console.log("modelForm", modelForm.value);

};

// 弹窗接收
const childFun = (op: string, data: any, treeData: any) => {
    // console.log("弹窗接收", data);
    visible.value = !visible.value;
    godds_cls_data.value = treeData;//分类树数组合并
    if (op == 'up') {
        http_r_p.value = 'up';//新增还是修改
        layer_title.value = '修改：' + data.id + " " + data.name;//弹窗标题
        shadeClose.value = true;//遮盖层关闭
        goods_id(data.id, data.dbid);
    } else {
        http_r_p.value = 'new';//新增还是修改
        layer_title.value = '新增';//弹窗标题
        shadeClose.value = false;//遮盖层关闭
        modelForm.value = {
            "cls_id": 1,//分类ID
            "sup_dbid": "SUP-SYS",//主供货商数据编号-默认SUP-SYS
            "expiration": 0, //保质期(天)
            "unit_tab": [],
        }
        auto_number_GoodsAutoNumber();//自助编号
    }
};

////////////////////////////////////////////////////////////////////////
// 多单位/多条码/多价格-辅助条码 ST 
// 多单位-表格数据
// 表格行样式
const cellStyle = (row: any, rowIndex: number) => {
    // console.log("行数据", row.unit_pack);
    // console.log("行索引", rowIndex);
    // 基本单位商品数据
    if (row.unit_pack == "B") {
        return "background-color:var(--global-neutral-color-1);color: #FF6C37;";
    }
};
//列字段提示
const tooltip_content = (row: any) => {
    // console.log("列字段提示-行数据", row);
    if (row.unit_pack == "A") {
        return "1" + row.unit + "内装" + row.unit_factor + modelForm.value.unit;
    } else if (row.unit_pack == "B") {
        return "基本单位";
    } else {
        return "……";
    }
};
// 表格-多单位-行单击
const Goods_unit_row = (row: any) => {
    // console.log("表格-多单位-行单击", row);
    current_data.value = {
        "current": true,//当前是否激活
        "goods_dbid": row.dbid,//商品档案表的数据编号-后端使用
        "barcode_data": row.barcode_data,//辅助条码-后端使用
        "goods_info": row,//商品档案信息
    }
};

// 表格-多单位-编辑
const GoodsPackEdit = (data: any) => {
    data.isEdit = true
    // console.log("多单位-表格-编辑表格", data);
};
// 表格-辅助条码-编辑
const GoodsBarcodeEdit = (data: any) => {
    data.isEdit = true
    // console.log("辅助条码-表格-编辑表格", data);
};
// 表格-多单位-保存
const GoodsPackSaveTable = (data: any) => {
    data.isEdit = false
    // console.log("多单位-表格-保存表格编辑", data);
};
// 表格-辅助条码-保存
const GoodsBarcodeSaveTable = (data: any) => {
    data.isEdit = false
    // console.log("辅助条码-保存", data);
    let vdb = {
        "goods_dbid": current_data.value.goods_dbid,
        "barcode": data.barcode//辅助条码
    }
    if (vdb.barcode == "") {
        layer.msg("辅助条码不能为空", { icon: 2 });
    } else {
        HTTP_BarcodeNew(vdb); // 辅助条码-远程新增
    }
};
// 辅助条码-远程新增
const HTTP_BarcodeNew = async (db: any) => {
    let data = await BarcodeNew(db);//HTTP
    if (data.code == 200) {
        layer.msg(data.msg, { icon: 1 });
        goods_id(modelForm.value.id, modelForm.value.dbid);
    } else {
        layer.msg(data.msg, { icon: 2 });
    }
};

// 多单位-表格-表格编辑的输入事件
const GoodsPackChangeData = (val: any, data: any, key: string) => {
    data[key] = val
};
// 辅助条码-表格-表格编辑的输入事件
const GoodsBarcodeChangeData = (val: any, data: any, key: string) => {
    data[key] = val
};

// 多单位-表格-删除行逻辑
const GoodsPackDel = (data: any) => {
    // console.log("多单位-表格-删除行逻辑", data);
    layer.confirm('确定删除此条数据？', {
        btn: [
            {
                text: '确定',
                callback: () => {
                    modelForm.value.unit_tab.forEach((item: any, index: number) => {
                        if (item.id === data.id) {
                            modelForm.value.unit_tab.splice(index, 1);
                        }
                    })
                    layer.closeAll();
                }
            }, {
                text: '取消',
                callback: () => {
                    layer.closeAll();
                }
            }]
    })
};
// 辅助条码-表格-删除行逻辑
const GoodsBarcodeDel = (data: any) => {
    // console.log("辅助条码-表格-删除行逻辑", data.goods_dbid);
    layer.confirm('确定删除此条数据？', {
        btn: [{
            text: '确定',
            callback: () => {
                modelForm.value.unit_tab.forEach((item: any, index: number, array: any) => {
                    if (item.dbid === data.goods_dbid) {
                        modelForm.value.unit_tab[index].barcode_data.splice(index, 1);
                    };
                })
                layer.closeAll();
            }
        }, {
            text: '取消',
            callback: () => {
                layer.closeAll();
            }
        }]
    })
};
//多单位-新增行
const GoodsPackAdd = () => {
    // console.log("多单位-新增行");
    modelForm.value.unit_tab.push({
        id: (modelForm.value.unit_tab.length + 1),
        dbid: '',//数据编号.唯一
        barcode: '',//主条码
        unit: '',//单位
        unit_factor: "",//装量
        unit_size: '',//包装规格
        unit_pack: "A",//包装单位-是否大单位_A是B否
        barcode_data: [],//辅助条码
        off_array: { off_putaway_web: true },
        off_putaway_web: 1,//上架商城
    })
}
// 辅助条码-新增行
const GoodsBarcodeAdd = () => {
    // console.log("辅助条码-新增行");
    modelForm.value.unit_tab.forEach((item: any, index: number, array: any) => {
        if (item.dbid == current_data.value.goods_dbid) {
            if (item.dbid == '') {
                layer.msg("请先保存“" + item.barcode + "”数据", { icon: 2 });
            } else {
                modelForm.value.unit_tab[index].barcode_data.push({
                    id: (modelForm.value.unit_tab[index].barcode_data.length + 1),
                    barcode: "辅助条码", goods_dbid: "归属商品", db_state: "A"
                })
            }
        }
    });
};

// 多单位/多条码/多价格 END
////////////////////////////////////////////////////////////////////////
// 表单校验规则
const Form_rules = ref({
    expiration: {
        "type": 'number',//保质期
        "min": 0,
        "max": 9999
    },
    barcode: {
        "type": 'string',//条码
    },
    unit: {
        "type": 'string',//基本单位
    },
    name: {
        "type": 'string',//商品名
    },
});
// 表单数据校验
const Form_validate = () => {
    clearValidate();//清除较验
    Form_Ref.value.validate(
        (isValidate: boolean, model: any, errors: any) => {
            console.log("是否通过", isValidate); // isValidate 是否通过
            console.log("表单数据", model);// model 表单数据
            console.log("错误信息", errors); // errors 错误信息
            // layer.open({
            //     type: 1,
            //     title: "表单数据校验结果",
            //     content: `<div style="padding: 10px"><p>是否通过 : ${isValidate}</p> <p>表单数据 : ${JSON.stringify(model)} </p> <p>错误信息 : ${JSON.stringify(errors)}</p></div>`,
            //     shade: false,
            //     isHtmlFragment: true,
            //     btn: [{ text: '确认', callback(index: any) { console.log(index); layer.close(index) } }],
            //     area: '500px'
            // });

            // if (isValidate) {
            //     let id = layer.load(1)
            //     setTimeout(() => {
            //         layer.close(id)
            //         layer.msg('提交成功', { icon: 1, time: 1000 })
            //         setTimeout(() => {
            //             Form_Ref.value.clearValidate();//清除校验
            //         }, 200)
            //     }, 2000)
            // } else {
            // }
        }
    )
};

////////////////////////////////////////////////////////////////////////

// 原始数据
const original = () => {
    // console.log("原始数据");
    Object.assign(modelForm.value, { ...form });
};
// 清空表单
const reset = () => {
    // console.log("清空表单");
    Form_Ref.value.reset();
};
// 清除校验
const clearValidate = () => {
    // console.log("清除校验");
    Form_Ref.value.clearValidate();//清除较验
};
// 窗口销毁
const end = (id: any) => {
    current_data.value = {
        "current": false,//当前是否激活
        "goods_dbid": "",//商品档案表的数据编号-后端使用
        "barcode_data": [],//辅助条码-后端使用
        "goods_info": {
            "id": -1,//
            "unit_pack": "A",//是否大单位_A是B否
            "name": "商品名称",//商品名称
            "prc_in": 0.00,//进货价
            "prc_web": 0.00,//商城价
            "prc_cust": 0.00,//批发价
            "prc_groupon": 0.00,//团购价
            "prc_vip": 0.00,//会员价
            "prc_dist": 0.00,//配送价
            "prc_sale": 0.00,//零售价
            "prc_same": 0.00,//同行价
            "off_array": {
                "off_putaway_web": true,//开关-上架商城_1是0否
            }
        },//商品档案信息
    };
    Tab_vmodel.value = "1";//TAB激活ID
    http_r_p.value == 'new';//新增窗口
    console.log(`窗口销毁:${id}`);
};
// 窗口关闭
const close = (id: any) => {
    console.log(`关闭前置:${id}`);
};
// 窗口关闭前置
const beforeClose = (id: any) => {
    console.log(`窗口关闭前置:${id}`);
    original();
};
////////////////////////////////////////////////////////////////////////
// 提交表单
const submit = function () {
    // console.log("提交表单");
    Form_Ref.value.validate((isValidate: any, model: any, errors: any) => {
        console.log("是否通过", isValidate); // isValidate 是否通过
        console.log("表单数据", model);// model 表单数据
        console.log("错误信息", errors); // errors 错误信息
        if (isValidate) {
            http_r(model);
        } else {

        }
    });
}
// HTTP请求
const http_r = async (model: any) => {
    console.log("HTTP请求");
    //新增还是修改
    if (http_r_p.value == 'up') {
        let data = await GoodsUP(model);//HTTP
        console.log(data);
        if (data.code == 200) {
            layer.msg(data.msg, { icon: 1 }, async () => {
                emit('topClick', '父组件事件');
                visible.value = !visible.value;
            });
        } else {
            layer.msg(data.msg, { icon: 2 });
        }
    } else if (http_r_p.value == 'new') {
        let data = await GoodsNEW(model);//HTTP
        if (data.code == 200) {
            layer.msg(data.msg, { icon: 1 }, async () => {
                emit('topClick', '父组件事件');
                visible.value = !visible.value;
            });
        } else {
            layer.msg(data.msg, { icon: 2 });
        }
    } else { }

};
// 获取商品档案自动编号
const auto_number_GoodsAutoNumber = async () => {
    layer.load(0, { time: 1000 });
    let data = await GoodsAutoNumber({ "val": "获取商品档案自动编号" });//HTTP
    modelForm.value.auto_number = data.count;
    console.log("获取商品档案自动编号", data);

};
//选项卡Tab事件
function tab_change_unit(id: any) {
    // console.log("选项卡Tab当前激活ID,", id);
    // console.log("选项卡Tab当前激活ID,", Tab_vmodel.value);
    if (http_r_p.value == 'new') {
        layer.msg("请先保存基本信息", { icon: 2 });
        Tab_vmodel.value = "1";
    }
}

//向父组件暴露子组件的方法或者数据
defineExpose({ childFun, });


</script>
